{#
This file is part of EC-CUBE

Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.

http://www.ec-cube.co.jp/

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.
#}
{% extends 'default_frame.twig' %}

{% set menus = ['customer', 'customer_master'] %}

{% block title %}会員管理{% endblock %}
{% block sub_title %}会員マスター{% endblock %}

{% form_theme searchForm 'Form/bootstrap_3_horizontal_layout.html.twig' %}

{% block stylesheet %}
<link rel="stylesheet" href="{{ app.config.admin_urlpath }}/assets/css/bootstrap-datetimepicker.min.css">
{% endblock stylesheet %}

{% block javascript %}
<script src="{{ app.config.admin_urlpath }}/assets/js/vendor/moment.min.js"></script>
<script src="{{ app.config.admin_urlpath }}/assets/js/vendor/moment-ja.js"></script>
<script src="{{ app.config.admin_urlpath }}/assets/js/vendor/bootstrap-datetimepicker.min.js"></script>
<script>
  $(function() {

    var inputDate = document.createElement('input');
    inputDate.setAttribute('type', 'date');
    if (inputDate.type !== 'date') {
      $('input[id$=_date_start]').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });

      $('input[id$=_date_end]').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });

      $('#admin_search_customer_birth_start').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });

      $('#admin_search_customer_birth_end').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });

      $('#admin_search_customer_last_buy_start').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });

      $('#admin_search_customer_last_buy_end').datetimepicker({
        locale: 'ja',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        showTodayButton: true
      });
    }

    // フォーム値を確認し、アコーディオンを制御
    // 値あり : 開く / 値なし : 閉じる
    (function($, f) {
        //フォームがないページは処理キャンセル
        var $ac = $(".accpanel");
        if (!$ac) {
            return false
        }

        //フォーム内全項目取得
        var c = f();
        if (c.formState()) {
            if ($ac.css("display") == "none") {
                $ac.siblings('.toggle').addClass("active");
                $ac.slideDown(0);
            }
        } else {
            $ac.siblings('.toggle').removeClass("active");
            $ac.slideUp(0);
        }
    })($, formPropStateSubscriber);
  });

</script>
{% endblock javascript %}

{% block main %}
<form name="search_form" id="search_form" method="post" action="">
  {{ form_widget(searchForm._token) }}
  <!--検索条件設定テーブルここから-->
  <div id="search_wrap" class="search-box">
    <div id="search_box" class="row">
      <div id="search_box_main" class="col-md-12 accordion">

        {{ form_widget(searchForm.multi, { attr: { placeholder: '会員ID・メールアドレス・お名前', class : 'input_search' } } ) }}

        <a id="search_box_main__toggle" href="#" class="toggle{% if active %} active{% endif %}"><svg class="cb cb-minus"> <use xlink:href="#cb-minus"/></svg> <svg class="cb cb-minus"> <use xlink:href="#cb-minus"/></svg></a>
        <div id="search_box_main__body" class="search-box-inner accpanel" {% if active %} style="display: block;"{% endif %}>
          <div class="row">
            <div id="search_box_main__body_inner" class="col-sm-12 col-lg-10 col-lg-offset-1 search">

              <div class="col-xs-6 col-md-4">
                <div id="search_box_main__customer_status" class="form-group">
                  <label>会員種別</label>
                  {{ form_widget(searchForm.customer_status) }}
                </div>
              </div>
              <div class="col-xs-6 col-md-4">
                <div id="search_box_main__sex" class="form-group">
                  <label>性別</label>
                  {{ form_widget(searchForm.sex) }}
                </div>
              </div>
              <div class="col-xs-12 col-md-4">
                <div id="search_box_main__birth_month" class="form-group">
                  <label>誕生月</label>
                  {{ form_widget(searchForm.birth_month) }}
                </div>
              </div>
              <div id="search_box_main__birth" class="col-xs-12 col-sm-12 col-md-6">
                <label>誕生日</label>
                <div class="form-group range">
                  {{ form_widget(searchForm.birth_start, {'attr': {'class': 'input_cal'}}) }} ～ {{ form_widget(searchForm.birth_end, {'attr': {'class': 'input_cal'}}) }}
                </div>
              </div>
              <div class="col-xs-6">
                <div id="search_box_main__pref" class="form-group">
                  <label>都道府県</label>
                  {{ form_widget(searchForm.pref) }}
                </div>
              </div>
              <div class="col-xs-6 col-sm-6">
                <div id="search_box_main__tel" class="form-group">
                  <label>電話番号</label>
                  {{ form_widget(searchForm.tel) }}
                  {{ form_errors(searchForm.tel) }}
                </div>
              </div>
              <div id="search_box_main__crate_date" class="col-xs-12 col-sm-6">
                <label>登録日</label>
                <div class="form-group range">
                  {{ form_widget(searchForm.create_date_start, {'attr': {'class': 'input_cal'}}) }} ～ {{ form_widget(searchForm.create_date_end, {'attr': {'class': 'input_cal'}}) }}
                </div>
              </div>
              <div id="search_box_main__update_date" class="col-xs-12 col-sm-6">
                <label>更新日</label>
                <div class="form-group range">
                  {{ form_widget(searchForm.update_date_start, {'attr': {'class': 'input_cal'}}) }} ～ {{ form_widget(searchForm.update_date_end, {'attr': {'class': 'input_cal'}}) }}
                </div>
              </div>
              <div class="col-xs-12 col-sm-6">
                <div id="search_box_main__buy_total" class="form-group range">
                  <label>購入金額</label>
                  {{ form_widget(searchForm.buy_total_start) }} ～ {{ form_widget(searchForm.buy_total_end) }}
                </div>
              </div>
              <div class="col-xs-12 col-sm-6">
                <div id="search_box_main__buy_times" class="form-group range">
                  <label>購入回数</label>
                  {{ form_widget(searchForm.buy_times_start) }} ～ {{ form_widget(searchForm.buy_times_end) }}
                </div>
              </div>
              {#
              <div class="col-xs-12 col-sm-12 col-md-6">
                <div class="form-group">
                  <label>購入商品カテゴリー</label>
                  {{ form_widget(searchForm.buy_category) }}
                </select>
              </div>
            </div>
            #}
            <div class="col-xs-12 col-sm-12 col-md-6">
              <div id="search_box_main__buy_product_code" class="form-group">
                <label>購入商品名・コード</label>
                {{ form_widget(searchForm.buy_product_code) }}
              </div>
            </div>
            <div id="search_box_main__last_buy" class="col-xs-12 col-sm-12 col-md-6">
              <label>最終購入日</label>
              <div class="form-group range">
                {{ form_widget(searchForm.last_buy_start, {'attr': {'class': 'input_cal'}}) }} ～ {{ form_widget(searchForm.last_buy_end, {'attr': {'class': 'input_cal'}}) }}
              </div>
            </div>
                <div class="extra-form col-xs-12 col-sm-12">
                    {% for f in searchForm.getIterator %}
                        {% if f.vars.name matches '[^plg*]' %}
                            <div class="form-group">
                            {{ form_label(f) }}
                            {{ form_widget(f) }}
                            {{ form_errors(f) }}
                            </div>
                        {% endif %}
                    {% endfor %}
                </div>
            <div id="search_box_main__clear" class="col-xs-12 col-sm-12">
              <p class="text-center"><a href="#" class="search-clear">検索条件をクリア</a></p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- /.col -->
  </div>
  <div id="search_box_footer" class="row btn_area">
    <div id="search_box_footer__button_area" class="col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-4 text-center">
      <button type="submit" class="btn btn-primary btn-block btn-lg">
        検索する <svg class="cb cb-angle-right"><use xlink:href="#cb-angle-right"></svg>
      </button>
    </div>
    <!-- /.col -->
  </div>
</div>
<!--検索条件設定テーブルここまで-->
{% if pagination %}
<div id="result_list" class="row">
  <div class="col-md-12">
    <div id="result_list_main" class="box">
      {% if pagination and pagination.totalItemCount > 0 %}
      <div id="result_list_main__header" class="box-header with-arrow">
        <h3 class="box-title">検索結果 <span class="normal"><strong>{{ pagination.totalItemCount }} 件</strong> が該当しました</span></h3>
      </div><!-- /.box-header -->
      <div id="result_list_main__body" class="box-body">
        <div id="result_list_main__menu" class="row">
          <div class="col-md-12">
            <ul class="sort-dd">
              <li id="result_list_main__pagemax_menu" class="dropdown">
                {% for pageMax in pageMaxis if pageMax.name == page_count %}
                  <a class="dropdown-toggle" data-toggle="dropdown">{{ pageMax.name|e }}件<svg class="cb cb-angle-down icon_down"><use xlink:href="#cb-angle-down"></svg></a>
                  <ul class="dropdown-menu">
                {% endfor %}
                  {% for pageMax in pageMaxis if pageMax.name != page_count %}
                    <li><a href="{{ path('admin_customer_page', {'page_no': 1, 'page_count': pageMax.name}) }}">{{ pageMax.name|e }}件</a></li>
                  {% endfor %}
                  </ul>
              </li>
              <li id="result_list_main__csv_menu" class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown">CSVダウンロード<svg class="cb cb-angle-down icon_down"><use xlink:href="#cb-angle-down"></svg></a>
              <ul class="dropdown-menu">
                <li><a href="{{ url('admin_customer_export') }}">CSVダウンロード</a></li>
                <li><a href="{{ url('admin_setting_shop_csv', { id : constant('\\Eccube\\Entity\\Master\\CsvType::CSV_TYPE_CUSTOMER') }) }}">出力項目設定</a></li>
              </ul>
              </li>
            </ul>
          </div>
        </div>
        {% for Customer in pagination %}
            <div id="result_list_main__list" class="table_list">
                <div class="table-responsive with-border">
                    <table class="table table-striped">
                        <thead>
                        <tr id="result_list_main__header">
                            <th id="result_list_main__header_id">会員ID</th>
                            <th id="result_list_main__header_name">会員名</th>
                            <th id="result_list_main__header_tel">電話番号</th>
                            <th id="result_list_main__header_mail">メールアドレス</th>
                            <th id="result_list_main__header_menu_box">&nbsp;</th>
                        </tr>
                        </thead>
                        <tbody>
                        {% for Customer in pagination %}
                        <tr id="result_list_main__item--{{ Customer.id }}">
                            <td id="result_list_main__id--{{ Customer.id }}" class="member_id">{{ Customer.id }}</td>
                            <td id="result_list_main__name--{{ Customer.id }}" class="member_name"><a href="{{ url('admin_customer_edit', { 'id': Customer.id}) }}">{{ Customer.name01 }}&nbsp;{{ Customer.name02 }}</a></td>
                            <td id="result_list_main__tel--{{ Customer.id }}" class="member_tel">{{ Customer.tel01 }}-{{ Customer.tel02 }}-{{ Customer.tel03 }}</td>
                            <td id="result_list_main__mail--{{ Customer.id }}" class="member_mail">{{ Customer.email }}</td>
                            <td id="result_list_main__menu_box--{{ Customer.id }}" class="icon_edit">
                                <div id="result_list_main__menu_box_toggle--{{ Customer.id }}" class="dropdown">
                                    <a class="dropdown-toggle" data-toggle="dropdown"><svg class="cb cb-ellipsis-h"> <use xlink:href="#cb-ellipsis-h" /></svg></a>
                                    <ul id="result_list_main__menu--{{ Customer.id }}" class="dropdown-menu dropdown-menu-right">
                                        <li><a href="{{ url('admin_customer_edit', { 'id': Customer.id}) }}">編集</a></li>
                                        <li><a href="{{ url('admin_customer_delete', { 'id': Customer.id}) }}" {{ csrf_token_for_anchor() }} data-method="delete" data-message="この会員情報を削除してもよろしいですか？">削除</a></li>
                                        {% if Customer.Status.id == 1 %}
                                        <li><a href="{{ url('admin_customer_resend', { 'id': Customer.id}) }}" {{ csrf_token_for_anchor() }} data-method="put" data-message="仮登録メールを再送してもよろしいですか？">仮会員メール再送</a></li>
                                        {% endif %}
                                    </ul>
                                </div>
                            </td>
                        </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        {% endfor %}
      </div><!-- /.box-body -->
      {% if pagination.totalItemCount > 0 %}
      {% include "pager.twig" with { 'pages' : pagination.paginationData, 'routes' : 'admin_customer_page' } %}
      {% endif %}
      {% else %}
      <div id="result_list_main__header" class="box-header with-arrow">
        <h3 class="box-title">検索条件に該当するデータがありませんでした。</h3>
      </div><!-- /.box-header -->
      {% endif %}
    </div><!-- /.box -->
  </div><!-- /.col -->
</div>
{% endif %}
</form>
{% endblock %}
